<template>
	<view>
		<hx-navbar ref="hxnb" :config="config">
			<block slot="right">
				<image style="justify-content: right;width: 64rpx;height: 64rpx;margin-right:30rpx;"
					src="../../static/plate/add.png" mode="aspectFit" @tap="publishWorks">
				</image>
			</block>
		</hx-navbar>
		<uni-swipe-action style="margin: 30rpx;" class="shopPlate" ref="swipeAction" v-for="(item,index) in addressData"
			:key="index">
			<uni-swipe-action-item :right-options="options" @change="swipeChange($event, index)"
				@click="swipeClick($event, index,item.id)">
				<view class="address">
					<view class="flex justify-between align-center">
						<view style="text-align: left;font-weight: 500;font-size: 32rpx;width: 410rpx;">
							<view class="flex">
								<text>{{item.receiverName}}</text>
								<text style="color: #1E1E1E80;margin-left: 28rpx;">{{item.receiverPhone}}</text>
							</view>
							<view style="margin-top: 15rpx;font-size: 28rpx;">
								{{item.receiverProvince}} {{item.receiverCity}} {{item.receiverDistrict}}
								{{item.receiverAddress}}
							</view>
						</view>
						<image @click="edit(item)" src="../../static/plate/edit.png" style="width: 48rpx;height: 48rpx;"
							mode=""></image>
					</view>
					<view v-if="item.defaultAddr == 1"
						style="border-top: 1rpx solid rgba(30,30,30,0.1);padding-top: 12rpx;color: rgba(30,30,30,0.3);margin-top: 15rpx;">
						默认地址
					</view>
				</view>
			</uni-swipe-action-item>
		</uni-swipe-action>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				config: {
					title: '地址管理',
					color: '#111111',
					backgroundColor: [1, '#FFFFFF'],
					border: true,
					rightSlot: true,
					// #ifdef H5
					backPage: '',
					// #endif
				},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#F84949FF',
						color: '#FFFFFFFF',
					}
				}],
				addressData: []
			}
		},
		onLoad() {
			this.getAddressList()
		},
		methods: {
			getAddressList() {
				this.$api.AddressList().then((res) => {
					this.addressData = res.data.result
				})
			},
			// 添加新地址
			publishWorks() {
				this.$tools.goPageNoAuth('./addressAdd')
			},
			// 编辑地址
			edit(e) {
				this.$tools.goPageNoAuth('./addressAdd??data=' + JSON.stringify(e))
			},
			// deleteAddress
			swipeChange(e, index) {},
			swipeClick(e, index, id) {
				let {
					content
				} = e;
				let data = {
					id: id
				}
				if (content.text === '删除') {
					uni.showModal({
						title: '提示',
						content: '是否删除',
						success: res => {
							this.$api.deleteAddress(data).then((res) => {
								this.getAddressList()
							})
							// if (res.confirm) {
							// 	this.swipeList.splice(index, 1);
							// } else if (res.cancel) {
							// 	console.log('用户点击取消');
							// }
						}
					});
				} else {
					uni.showToast({
						title: `点击了删除按钮`,
						icon: 'none'
					});
				}
			}
		}
	}
</script>

<style scoped>
	.address {
		padding: 30rpx;
		background-color: #fff;
		border-radius: 20rpx;
	}
</style>
